import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:sainbainu/common/values/colors.dart';

import '../index.dart';

class SearchPanel extends GetView<GlobalSearchController> {
  final void Function(String text) onHistoryTap;
  final void Function() onHistoryClearConfirmTap;
  final void Function() onHistoryClearToggleTap;
  final void Function(String text) onHotTap;
  final void Function() onHotRefreshTap;

  const SearchPanel({
    super.key,
    required this.onHistoryTap,
    required this.onHistoryClearConfirmTap,
    required this.onHistoryClearToggleTap,
    required this.onHotTap,
    required this.onHotRefreshTap,
  });

  @override
  Widget build(BuildContext context) {
    return ListView(
      padding: const EdgeInsets.all(16),
      children: [
        _buildHistory(),
        _buildHot(),
      ],
    );
  }

  /// 历史搜索
  _buildHistory() {
    return GetBuilder<GlobalSearchController>(
      id: 'search_history',
      builder: (_) {
        return _.state.historyList.isNotEmpty
            ? Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  _buildTitleRow([
                    _buildTitle('搜索历史'.tr),
                    _buildHistoryRight(),
                  ]),
                  const SizedBox(height: 8),
                  _buildHistoryList(_.state.historyList),
                  const SizedBox(height: 25),
                ],
              )
            : const SizedBox.shrink();
      },
    );
  }

  /// 历史搜索列表
  Widget _buildHistoryList(List<String> historyList) {
    return Wrap(
      runSpacing: 10,
      spacing: 10,
      children: historyList.map((t) {
        return GestureDetector(
          onTap: () => onHistoryTap(t),
          child: Chip(
            label: Text(t),
            labelStyle: const TextStyle(
              fontSize: 12,
              color: AppColors.active,
            ),
            labelPadding:
                const EdgeInsets.symmetric(horizontal: 4, vertical: 0),
            shape: const StadiumBorder(),
            side: const BorderSide(color: Colors.transparent, width: 0),
            backgroundColor: AppColors.border,
            materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
          ),
        );
      }).toList(),
    );
  }

  /// 历史搜索头部
  Widget _buildHistoryRight() {
    return Obx(() {
      if (controller.state.enableHistoryDelete.value) {
        return Row(
          children: [
            _buildIconText(
              icon: Icons.done_rounded,
              label: '确认删除'.tr,
              onTap: () => onHistoryClearConfirmTap(),
            ),
            const SizedBox(width: 10),
            _buildIconText(
              icon: Icons.close_rounded,
              label: '取消'.tr,
              onTap: () => onHistoryClearToggleTap(),
            ),
          ],
        );
      }
      return _buildIconText(
        icon: Icons.delete_outline_rounded,
        label: '删除'.tr,
        onTap: () => onHistoryClearToggleTap(),
      );
    });
  }

  /// 热门搜索
  _buildHot() {
    return GetBuilder<GlobalSearchController>(
      id: 'search_hot',
      builder: (_) {
        return _.state.hotList.isNotEmpty
            ? Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  _buildTitleRow([
                    _buildTitle('热门搜索'.tr),
                    _buildIconText(
                      icon: Icons.refresh_rounded,
                      label: '换一换'.tr,
                      onTap: () => onHotRefreshTap(),
                    ),
                  ]),
                  const SizedBox(height: 8),
                  _buildHotList(_.state.hotList),
                ],
              )
            : const SizedBox.shrink();
      },
    );
  }

  /// 热门搜索列表
  Widget _buildHotList(List<String> hotList) {
    return LayoutBuilder(builder: (context, constraint) {
      var itemWidth = constraint.maxWidth / 2 - 8;
      return Wrap(
        runSpacing: 8,
        spacing: 16,
        children: hotList.map((t) {
          return SizedBox(
            width: itemWidth,
            child: GestureDetector(
              onTap: () => onHotTap(t),
              child: Text(
                t,
                style: const TextStyle(
                  fontSize: 15,
                  color: AppColors.active,
                ),
                maxLines: 1,
                overflow: TextOverflow.ellipsis,
              ),
            ),
          );
        }).toList(),
      );
    });
  }

  Widget _buildTitleRow(List<Widget> children) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: children,
    );
  }

  Widget _buildTitle(String title) {
    return Text(
      title,
      style: const TextStyle(
        fontSize: 16,
        fontWeight: FontWeight.w500,
        color: Colors.black,
      ),
    );
  }

  Widget _buildIconText({
    required IconData icon,
    required String label,
    VoidCallback? onTap,
  }) {
    return InkWell(
      onTap: onTap,
      enableFeedback: true,
      child: Row(
        children: [
          Icon(
            icon,
            color: AppColors.unactive,
            size: 18,
          ),
          Text(
            label,
            style: const TextStyle(
              fontSize: 13,
              color: AppColors.unactive,
            ),
          ),
        ],
      ),
    );
  }
}
